import React from 'react';

import {WeaUpload,WeaBrowser,WeaHelpfulTip,WeaDialog,WeaLocaleProvider,WeaTools, WeaSearchGroup, WeaFormItem,WeaInput,WeaNewScroll,WeaSelectGroup,WeaTable,WeaInputNumber,WeaColorPicker,WeaSelect,WeaCheckbox} from 'ecCom'
const getLabel = WeaLocaleProvider.getLabel;
import {WeaPortalShare,WeaMaterialLib} from 'weaPortalPublic';
import './style/';
import {Tabs, Button, Spin, Icon, message, Modal,Row,Col} from 'antd';
import {Carousel} from "./index";
const TabPane = Tabs.TabPane;
class Setting extends React.Component{



    load = (id)=>{
        WeaTools.callApi('/api/portalTs/e7form/saveInitE7form', 'POST', {"json":JSON.stringify({id:id,setting:JSON.stringify(this.props.state.defaultSetting)})}).then((result) => {
            if (result.status == true) {
                if(result.data != null){
                    let data = result.data
                    data.setting = JSON.parse(data.setting)
                    this.props.setStateData({data:data})
                }
            }
        });
    }

    cancelAndReflush = ()=>{
        const id = this.props.state.data.id
        this.props.setStateData({
            settingVisiable : false
        })


        this.load(id)
    }


    updateSetting = () =>{
        let data = JSON.parse(JSON.stringify(this.props.state.data))
        data.setting = JSON.stringify(data.setting)
        WeaTools.callApi('/api/portalTs/e7form/updateE7formById', 'POST', {"json":JSON.stringify(data)}).then((result) => {

            if (result.status == true) {
                this.props.setStateData({settingVisiable:false})
                message.success(getLabel(83551, '保存成功！'), 3);
            }else{
                message.error(getLabel(84544, '保存失败！'), 3);
            }
        });
    }


    setSetting = (temp)=>{
        const data = this.props.state.data
        const setting =Object.assign({},data.setting,temp)
        data.setting = setting
        this.props.setStateData({data:data})
    }

    render (){
        let {logoImage,bgImage} = this.props.state.data.setting
        let logoImageArr = []
        if(logoImage){
            logoImageArr = logoImage.split(',').slice(0, 3);
        }
        let bgImageSrc = bgImage;
        return (
            <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@82c0k4`}
                title="设置"
                visible={this.props.state.settingVisiable}
                iconBgcolor='#1a57a0'
                hasScroll={false}
                style={{width: 900,height : 500}}
                onCancel={()=>{this.cancelAndReflush()}}
            >
                <Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@oxunjj`} spinning={false}>
                    <Tabs ecId={`${this && this.props && this.props.ecId || ''}_Tabs@ti4jam`} defaultActiveKey="1" className="portal-esetting-tabs" onChange={()=>{}}>
                        <TabPane ecId={`${this && this.props && this.props.ecId || ''}_TabPane@683me1`} tab={getLabel(33368, '内容')} key="1">
                            <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@3m72gz`} title={getLabel(81711, '基本信息')} needTigger={true} showGroup={true} >
                                <div className="lr_managerSetting_style_base_div">
                                    <div style={{'margin-bottom':'10px'}}>
                                        <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@i8yle4`} gutter={24} type="flex" justify="start" align="middle">
                                            <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@ybt0p1`} span={3}>背景图片 :</Col>
                                            <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@s68dsg`} span={2}>
                                                <WeaMaterialLib ecId={`${this && this.props && this.props.ecId || ''}_WeaMaterialLib@6jrmnh`} multiCheck={false}  onChange={(value)=>{this.setSetting({bgImage:value})}} type='button' >
                                                     <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@25kbnf`} type="primary">{getLabel(502488, '设置')}</Button>
                                                </WeaMaterialLib>
                                            </Col>
                                            <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@ae0jdk`} span={3}>
                                                {
                                                    bgImage != this.props.state.defaultSetting.bgImage? (
                                                        <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@wmjctc`} type="primary" onClick={()=>{this.setSetting({bgImage:this.props.state.defaultSetting.bgImage})}}>{getLabel(32757, '恢复默认')}</Button>
                                                    ):(
                                                        <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@1nzuoj`} >{getLabel(32757, '恢复默认')}</Button>
                                                    )
                                                }
                                            </Col>

                                        </Row>
                                        <div style={{'margin-top':'10px'}}>
                                            <img style={{width:'100px',height:'100px'}} src={bgImageSrc}/>
                                        </div>
                                    </div>
                                    <div style={{'margin-bottom':'10px'}}>
                                        <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@8onxmo`} gutter={24} type="flex" justify="start" align="middle">
                                            <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@khngis`} span={3}>滚动图片 :</Col>
                                            <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@hekvuw`} span={2}>
                                                <WeaMaterialLib ecId={`${this && this.props && this.props.ecId || ''}_WeaMaterialLib@7l2wpp`} multiCheck={true}  onChange={(value)=>{this.setSetting({logoImage:value})}} type='button' >
                                                    <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@uc6t5l`} type="primary">{getLabel(502488, '设置')}</Button>
                                                </WeaMaterialLib>

                                            </Col>
                                            <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@epyzxj`} span={3}>
                                                {
                                                    logoImage != this.props.state.defaultSetting.logoImage ? (
                                                        <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@00m2t8`} type="primary" onClick={()=>{this.setSetting({logoImage:this.props.state.defaultSetting.logoImage})}}>{getLabel(32757, '恢复默认')}</Button>
                                                    ):(
                                                        <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@yyntqx`} >{getLabel(32757, '恢复默认')}</Button>
                                                    )
                                                }

                                            </Col>

                                        </Row>
                                        <div style={{'margin-top':'10px'}}>
                                            {
                                                logoImageArr.map((item,index)=>{
                                                    return (
                                                          <img style={{width:'100px',height:'100px','margin-right':'5px'}} src={item}/>
                                                    )
                                                })
                                            }
                                        </div>
                                    </div>
                                </div>
                            </WeaSearchGroup>

                        </TabPane>
                    </Tabs>
                </Spin>
                <div className="portal-esetting-confirm lr_managerSetting_option_buttons_div" >
                    <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@txccfc`} type="primary" onClick={() => {this.updateSetting()}}>{getLabel(30986, '保存')}</Button>
                    <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@7btn2g`} type="ghost"  style={{marginLeft: '10px'}} onClick={()=>{this.cancelAndReflush()}}>{getLabel(31129, '取消')}</Button>
                </div>
            </WeaDialog>
            )

    }

}
export default Setting